<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<link href="https://cdn.bootcss.com/font-awesome/5.8.0/css/all.css" rel="stylesheet" />
		<title>Persion Website</title>
		<style>
			body {
				min-height: 100vh;
				margin: 0;
				padding: 0;
				background: url('../images/93.jpg');
				background-size: cover;
				background-repeat: no-repeat;
				background-position: center center;
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.box {
				width: 450px;
				background: rgba(0, 0, 0, 0.4);
				padding: 40px;
				text-align: center;
				color: white;
				font-family: 'Century Gothic', sans-serif;
			}
			.box-img {
				border-radius: 50%;
				width: 200px;
				height: 200px;
			}
			.box h1 {
				font-size: 40px;
				letter-spacing: 4px;
				font-weight: 100;
			}
			.box h5 {
				font-size: 20px;
				letter-spacing: 3px;
				font-weight: 100;
			}
			.box p {
				text-align: justify;
			}
			ul {
				margin: 0;
				padding: 0;
			}
			.box li {
				display: inline-block;
				margin: 6px;
				list-style: none;
			}
			.box li a {
				color: white;
				text-decoration: none;
				font-size: 60px;
				transition: all ease-in-out 250ms;
			}
			.box li a:hover {
				color: #b9b9b9;
			}
		</style>
	</head>
	<body>
		<div class="box">
			<img src="../images//微信头像.jpg" alt="" class="box-img" />
			<h1>yyeexin</h1>
			<h5>Web Devloper - Web Designer</h5>
			<p>
				Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem laboriosam nesciunt voluptatibus minima
				ipsa architecto delectus at veritatis repudiandae quasi? Expedita ad nostrum at.
			</p>
			<ul>
				<li>
					<a href="https://public-1256942570.cos.ap-chengdu.myqcloud.com/qrcode.jpg"
						><i class="fab fa-weixin"></i
					></a>
				</li>
				<li>
					<a href="https://public-1256942570.cos.ap-chengdu.myqcloud.com/qq_qccode.jpg"
						><i class="fab fa-qq"></i
					></a>
				</li>
				<li>
					<a href="https://github.com/yyeexin"><i class="fab fa-github"></i></a>
				</li>
			</ul>
		</div>
	</body>
</html>
